import type { FC, ReactElement } from "react"
import { useIntl } from "react-intl"
import type { RouteProps } from "react-router"

import PrivateRoute from "./pravateRoute"

export type WrapperRouteProps = RouteProps & {
	/** document title locale id */
	titleId: string
	/** authorization？ */
	auth?: boolean
}

const WrapperRouteComponent: FC<WrapperRouteProps> = ({ titleId, auth, ...props }) => {
	const { formatMessage } = useIntl()

	if (titleId) {
		document.title = `${formatMessage({
			id: "title.base"
		})}-${formatMessage({
			id: titleId
		})}`
	}
	// console.log(titleId)

	return auth ? <PrivateRoute {...props} /> : (props.element as ReactElement)
}

export default WrapperRouteComponent
